<template>
    <!-- 短信功能设置 -->
    <div class="smsFunctionSeting" v-loading="isLoading">
        <cardComponent pageTitle="短信功能设置">
            <template slot="cardBody">
                <div class="dialogVisible">
                    <el-form
                        :model="searchFormOne"
                        size="small"
                        label-width="40%"
                        :rules="rules"
                        ref="formData"
                    >
                        <el-form-item label="账户类别：" label-position="left" prop="mainCardNo">
                            <el-input disabled v-model="accountType" style="width: 200px;"></el-input>
                        </el-form-item>

                        <el-form-item label="卡号：" label-position="left" prop="CARDNBR">
                            <el-input v-model="searchFormOne.CARDNBR" disabled></el-input>
                        </el-form-item>

                        <el-form-item label="修改为" label-position="left" prop="SMSYN">
                            <el-select placeholder="请选择" v-model="searchForm.allowOrNot">
                                <el-option value="1" label="使用"></el-option>
                                <el-option value="2" label="不使用"></el-option>
                            </el-select>
                            <span>{{ searchFormOne.SMSYN === 0 ? "未开通" : "已开通" }}</span>
                        </el-form-item>

                        <el-form-item label="人民币通知最低交易额：" label-position="left" prop="RMBminmum">
                            <el-input
                                v-model="searchFormOne.LOWAMT"
                                :disabled="searchForm.allowOrNot === '2' ? true : false"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="美元通知最低交易额：" label-position="left" prop="theLowestY">
                            <el-input
                                v-model="searchFormOne.LOWAMT2"
                                :disabled="searchForm.allowOrNot === '2' ? true : false"
                            >></el-input>
                        </el-form-item>

                        <div class="btnBox">
                            <el-button
                                type="primary"
                                size="small"
                                @click="hanleSure"
                                icon="el-icon-circle-check"
                            >确定</el-button>
                        </div>
                    </el-form>
                </div>
            </template>
        </cardComponent>
    </div>
</template>

<script>
import { mapState } from 'vuex';
import { reolaceString, strZeroFill, getAccountTypeName } from '@/utils/Common';
import cardComponent from '@/components/cardComponent/cardComponent.vue';

export default {
    name: 'smsFunctionSeting',
    components: {
        cardComponent,
    },
    data() {
        return {
            searchFormOne: {
                CARDNBR: '',
                // 是否使用
                SMSYN: '',
                // 人民币通知最低
                LOWAMT: '0',
                // 美元通知最低
                LOWAMT2: '0',
            },
            searchForm: { // 搜索表单字段
                CARDNO: '',
                // 是否使用
                allowOrNot: '',
                optionsLable: '',
                // 状态
                UNQPASS: '',

            },
            dialogVisible: false,
            accountType: '',
            isLoading: false,
            SERCNT: '99999999999999999999', // 点击按钮时请求是否开通短信
            rules: {
                RMBminmum: [
                    { pattern: /^[0-9]*$/, message: '请输入数值', trigger: 'blur' },
                ],
                theLowestY: [
                    { pattern: /^[0-9]*$/, message: '请输入数值', trigger: 'blur' },
                ],
                SMSYN: [
                    { required: true, message: '请选择是否使用短信功能', trigger: 'blur' },
                ],

            },
        };
    },
    filters: {

    },
    async mounted() {
        this.getCardInfo();
        this.accountType = await getAccountTypeName(this.cardList_3601, this.cardInfo_3004, this);
        this.searchFormOne.CARDNBR = this.cardInfo_3004.CARDNO;
    },
    computed: mapState({
        cardInfo_3004: state => state.common.cardInfo_3004,
        cardList_3601: state => state.common.cardList_3601,
        defaultParams: state => state.common.defaultParams,
        defaultpinFlag: state => state.common.pinFlag,
    }),
    methods: {
        // 点击确定按钮进行修改
        hanleSure() {
            this.hanleTableData();
        },
        // 进入页面获取卡信息
        getCardInfo() {
            this.isLoading = true;
            const appBody = {
                CARDNBR: this.cardInfo_3004.CARDNO || '', // 卡号
                OPT: '1', // 查询方式 1-卡号查询  2-证件号查询
                PINFLAG: this.defaultpinFlag, // 是否检查密码标志
                PIN: '123456', // 密码
            };
            const defaultParams = JSON.parse(JSON.stringify(this.defaultParams));
            defaultParams.body.appHead.tranCode = '3014';
            defaultParams.body.appBody = appBody;
            // 3014交易
            this.$post.common.transPort(defaultParams).then((res) => {
                this.isLoading = false;
                if (res.status === 200) {
                    const result = JSON.parse(res.data.jsonRes);
                    // console.log(result, 111111)
                    if (result.sysHead.rspCd === '000000') {
                        this.searchFormOne = result.body.appBody || [];
                    } else {
                        const errorMsg = `错误代码：${result.sysHead.rspCd}, 错误信息：${result.sysHead.rspMsg}`;
                        this.$alert(errorMsg, '提示', {
                            customClass: 'error', type: 'error',
                        });
                    }
                } else {
                    this.$alert('请求失败！', '提示', {
                        customClass: 'error', type: 'error',
                    });
                }
            });
        },
        // 找到20个9中的第三个

        hanleTableData() {
            if (this.searchForm.allowOrNot === '1') {
                const newSERCNT = reolaceString(this.SERCNT, 2, 1);
                this.SERCNT = reolaceString(newSERCNT, 4, 1);
            } else if (this.searchForm.allowOrNot === '2') {
                const newSERCNT = reolaceString(this.SERCNT, 2, 0);
                this.SERCNT = reolaceString(newSERCNT, 4, 1);
            } else {
                this.$alert('请选择是否使用短信功能', '提示', {
                    customClass: 'warning', type: 'warning',
                });
                return;
            }
            // console.log(this.searchFormOne.LOWAMT)
            // console.log(this.searchFormOne.LOWAMT2)
            const appBody = {
                CARDNBR: this.cardInfo_3004.CARDNO || '', // 卡号
                PINFLAG: this.defaultpinFlag, // 是否检查密码标志
                SERCNT: this.SERCNT, // 0为不开通 1为开通 9为不作修改
                LOWAMT: strZeroFill(this.searchFormOne.LOWAMT, 9), // 短信通知第一币种下限   //位数不足前面补0
                LOWAMTX: strZeroFill(this.searchFormOne.LOWAMT2, 9), // 短信通知第二币种下限  //位数不足前面补0
                STSCHK: 'N', // N：不检查，任何状态都允许操作 其他：检查 卡片检查状态

            };
            const defaultParams = JSON.parse(JSON.stringify(this.defaultParams));
            defaultParams.body.appHead.tranCode = '4012';
            defaultParams.body.appBody = appBody;
            // 4012交易
            this.$confirm('确定修改？', '提示', { customClass: 'warning', type: 'warning' }).then(() => {
                this.isLoading = true;
                this.$post.common.transPort(defaultParams).then((res) => {
                    this.isLoading = false;
                    if (res.status === 200) {
                        const result = JSON.parse(res.data.jsonRes);
                        // console.log(result, 111111)
                        if (result.sysHead.rspCd === '000000') {
                            // this.searchForm = result.body.appBody || []
                            this.$alert(result.sysHead.rspMsg, '提示', {
                                customClass: 'success', type: 'success',
                            });
                            this.getCardInfo();
                            this.InitUpdate();
                        } else {
                            const errorMsg = `错误代码：${result.sysHead.rspCd}, 错误信息：${result.sysHead.rspMsg}`;
                            this.$alert(errorMsg, '提示', {
                                customClass: 'error', type: 'error',
                            });
                        }
                    } else {
                        this.$alert('请求失败！', '提示', {
                            customClass: 'error', type: 'error',
                        });
                    }
                });
            }).catch(() => {

            });
        },
        // 更新初始数据
        InitUpdate() {
            this.isLoading = true;
            const appBody = {
                CARDNO: this.cardInfo_3004.CARDNO, // 卡号
                PINFLAG: this.pinFlag, // 是否检查密码标志 0-不检查
            };
            const params = JSON.parse(JSON.stringify(this.defaultParams));
            // console.log(this.defaultParams, 'this.defaultParams')
            params.body.appHead.tranCode = '3001';
            params.body.appBody = appBody;
            // 跑 3001 交易
            this.$post.common.transPort(params).then((res) => {
                this.isLoading = false;
                if (res.status === 200) { // 请求成功
                    const result = JSON.parse(res.data.jsonRes);
                    console.log(result, 'result -- 3001');
                    if (result.sysHead.rspCd === '000000') { // 交易成功
                        // 更新 vuex 缓存 卡账户信息
                        this.$store.commit('common/UPDATE_CARD_ACCOUNT_INFO', result.body.appBody);
                    } else { // 交易失败
                        const errorMsg = `错误代码：${result.sysHead.rspCd}, 错误信息：${result.sysHead.rspMsg}`;
                        this.$alert(errorMsg, result.sysHead.rspDesc, {
                            customClass: 'error', type: 'error',
                        });
                    }
                } else { // 请求失败
                    this.$alert('请求失败!', '提示', {
                        customClass: 'error', type: 'error',
                    });
                }
            });
        },


    },
};
</script>

<style lang='scss'>
.smsFunctionSeting {
    width: 98%;
    background: #fff;
    // padding:10px;
    box-sizing: border-box;
    border-radius: 5px;

    /* //头部内容 */
    .tab-header {
        width: 100%;
        text-align: left;
        span {
            font-size: 14px;
        }
        .headerTitle {
            font-size: 16px;
            margin: 10px 0px;
            color: skyblue;
        }
    }
    .btnBox {
        text-align: center;
    }
    .dialogVisible {
        margin: 30px auto 0;
        .el-form-item__content {
            text-align: left;
        }
    }
}
</style>
